<template>
	<div class="reply-wrap">
		<div class="left">
			<img
				:src="filterImageUrl(replyItem.headerimg)"
				alt="图片"
				style="border-radius: 50%; width: 30px;height:30px"
			/>
		</div>
		<div class="right">
			<span class="nick">{{ replyItem.nick }}:</span>
			<span>{{ replyItem.message }}</span>
		</div>
		<div class="time">
			<span>{{ dayjs(replyItem.reply_time).format('YYYY-MM-DD HH:mm:ss') }}</span>
		</div>
	</div>
</template>

<script setup lang="ts">
import { dayjs } from 'element-plus'
import {filterImageUrl} from '@/utils'
defineProps(['replyItem', 'logId'])
</script>

<style lang="scss" scoped>
.reply-wrap {
	display: flex;
	position: relative;
	//background-color: rgb(245, 245, 241);
	padding-top: 5px;
	padding-bottom: 25px;
	padding-left: 20px;
	border-bottom: 1px solid #ebeef5;
	font-size: 12px;
	.left {
		margin-right: 5px;
	}
	.right {
		.nick {
			color: #0d68c4;
		}
	}
	.time {
		position: absolute;
		bottom: 0px;
		right: 5px;
		span {
			font-size: 12px;
			color: #94969b;
			margin-right: 5px;
		}
		a {
			font-size: 12px;
			color: #94969b;
			&:hover {
				text-decoration: underline;
			}
		}
	}
}
</style>
